Using the Source tab

The Source tab displays the source code of the documents you are editing. You can directly edit the source code and optionally see a preview of the changes you are making in the Visual Source Engine. The Source tab differs from the Design tab in that the code is visible and can be edited directly (refer to Using the Design tab for more information).

The following buttons are available:

• - Close the currently edited document.

• - Display the window in full-screen mode.

• - Display or hide the Side Panels.

• - Remove white space from the front of the selected text.

• - Add white space to the front of the selected text.

• - Go to the first document in your document list.

• - Go to the previous document in your document list.

• - Go to the next document in your document list.

• - Go to the last document in your document list.

• - Add a bookmark to your source code - refer to Using bookmarks for more information.

• - Go to the bookmark in the source code you select from the drop-down list - refer to Going to a bookmark for more information.

• - Display a list of edit options for the Source tab. The following options are available:

  • Show Gutter - Displays a column of gray space to the left of the source code.

  • Show Line Numbers - Displays the line numbers for the source code in the gutter.

  • Show Hidden Characters - Displays white space characters (spaces, tabs, new lines) that are normally hidden.

  • Word Wrap - Automatically wraps lines that extend beyond the end of the display area to a new line. This is a visual change only - no new lines are created.

• - Automatically wraps lines that extend beyond the end of the display area to a new line. This is a visual change only - no new lines are created.

• - Open a second floating source display area. Any changes made in this window are updated in the Source and Preview tabs only.

• - Show or hide the Visual Source Engine, a preview function that displays what the web document will look like in a browser.

• - Adjust the display settings for the Visual Source Engine. The following options are available:

  • Horizontal - Display the preview area horizontally.

  • Vertical - Display the preview area vertically.

  • Swap Window Panes - Swap the preview area with the source code area.

  • Update/Refresh Preview - Refresh the Visual Source Engine display.

To use the Source tab:

1. Click on the tab.

2. The source code for the currently edited document is now displayed. You can use any of the buttons described at the beginning of this topic, if required.